<template>
	<view>
		<view class="box">
			<view class="title font-weight">{{jobDetail.job_name}}</view>
			<view class="des">
				<view class="jobDes">
					<image class="des-icon" mode="widthFix" src="/static/img/jobDetails/city.svg"></image>
					<text>{{jobDetail.company_location}}</text>
				</view>
				<view class="jobDes">
					<image class="des-icon" mode="widthFix" src="/static/img/jobDetails/type.svg"></image>
					<text>{{jobDetail.company_cat}}</text>
				</view>
			</view>
			<view class="company">
				<text class="company-name">{{jobDetail.company_name}}</text>
				<text class="company-status">{{jobDetail.company_scale}}</text>
			</view>
			<view class="hr" @tap="showMenu">
				<image class="hr-avatar" mode="widthFix" src="/static/img/jobs/avatar.svg"></image>
				<text>{{jobDetail.company_hr}}</text>
			</view>
			<view class="salary">{{jobDetail.job_salary}}</view>
		</view>

		<view class="box">
			<view class="title font-weight">岗位要求</view>
			<view class="jobDetail">
				<view>
					<text>{{jobDetail.job_requirement}}</text>
				</view>
			</view>
		</view>

		<view class="box">
			<view class="title font-weight">职位描述</view>
			<view>
				<template v-for="(ele,index) in getLabels(jobDetail.job_label)" :key="index">
					<text class="tag">{{ele}}</text>
				</template>
			</view>
			<view class="jobDetail">
				<view>
					<text>{{jobDetail.job_description}}</text>
				</view>
			</view>
		</view>
		<template>
			<view class="box"
				@tap="openLocation(Number(jobDetail.company_position.latitude),Number(jobDetail.company_position.longitude))">
				<view class="flex-center">
					<view class="title">
						<image mode="widthFix" class="title-icon" src="/static/img/jobDetails/map.svg"></image>
						<text>查看企业地图</text>
					</view>
					<image mode="widthFix" class="more-btn" src="/static/img/common/more.svg"></image>
				</view>
			</view>
		</template>
		<!-- 投递简历按钮 -->
		<view class="submit">
			<button @tap="showResume" class="submit-btn" style="width:660rpx;">投递简历</button>
		</view>
		<!-- 抽屉组件 -->
		<Drawer ref="drawerRef" :resumes="resumes" @sendResume="sendResume" />
	</view>
</template>

<script setup>
	import Drawer from '/components/drawer/drawer.vue'
	import {
		req,
		post
	} from '/hooks/req.js'
	import {
		ref,
		inject
	} from 'vue'
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		decrypt,
		encrypt
	} from "/hooks/encrypt.js"
	import loginCheck from '/hooks/loginCheck.js'
	const jobDetail = ref({})
	const $root = inject('$root')
	const drawerRef = ref()
	const resumes = ref([])
	let token = ""
	let rid = ""

	const openLocation = (x, y) => {
		uni.openLocation({
			latitude: x,
			longitude: y
		})
	}

	onLoad((options) => {
		let id = options.id
		rid = Number(id)
		getDetail(id)
		if (loginCheck()) {
			token = decrypt(JSON.parse(uni.getStorageSync("userData")).token)
			getResume()
		}
	})

	const sendResume = (cid) => {
		// console.log(cid)
		post($root + `/postresume/`, {
			cid,
			rid
		}, token).then(result => {
			console.log(result)
			if (result.data.code == 200) {
				uni.showToast({
					title: result.data.data
				})
			} else {
				uni.showToast({
					title: result.data.data,
					icon: "error"
				})
			}
		})
	}

	//获取简历数据
	const getResume = () => {
		req($root + `/curri/`, token).then(res => {
			resumes.value = res.data.data
			if (resumes.value.length != 0) {
				//需要展示这个组件
				drawerRef.value.switchDrawer()
			} else {
				uni.showModal({
					title: '系统提示',
					content: '您还未创建简历，请先创建简历',
					success(r) {
						if (r.confirm) {
							uni.switchTab({
								"url": '/pages/resume/resume',
							})
						}
					}
				})
			}
		})
	}

	//获取岗位详情数据
	const getDetail = id => {
		req($root + `/recruit/${id}`)
			.then(result => {
				if (result.data.code == 200) {
					jobDetail.value = result.data.data
				}
			})
	}

	//getLabels 获取标签
	const getLabels = function(str) {
		if (str) {
			return str.split(";")
		}
	}

	//showResume 显示简历列表
	const showResume = () => {
		if (loginCheck()) {
			//获取简历数据
			getResume()
		}
	}

	const showMenu = () => {
		uni.showActionSheet({
			//弹出菜单选项
			itemList: ["保存联系人", "拨打电话", "发送短信"],
			success(res) {
				if (res.tapIndex == 0) {
					uni.getSetting({
						success(res) {
							if (!res.authSetting['scope.addPhoneContact']) {
								uni.authorize({
									scope: "scope.addPhoneContact"
								})
							}
							uni.addPhoneContact({
								nickName: jobDetail.value.company_hr,
								organization: jobDetail.value.company_hr
							})
						}
					})
				} else if (res.tapIndex == 1) {
					uni.makePhoneCall({
						phoneNumber: "1111"
					})
				} else if (res.tapIndex == 2) {
					uni.sendSms({
						phoneNumber: "18212312310",
						content: "ceshi"
					})
				}
			},
			fail(err) {
				console.log(err)
			}
		})
	}
</script>


<style>
	page {
		padding-bottom: 70px;
	}
</style>
<style scoped>
	.mask {
		width: 100%;
		height: 100px;
		background-color: white;
		position: fixed;
		bottom: 0;
		z-index: 999999;
		padding: 10px;
		box-sizing: border-box;
		transition: all 1s linear;
		box-shadow: 0px -1px 2px #dedede;
	}

	.selectCon {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		overflow-y: scroll;
		margin-top: 15px;
	}

	.selectItem {
		height: 26px;
		text-align: center;
		line-height: 26px;
		border: 1px solid #e8e8e8;
		border-radius: 26px;
		margin: 0px 10px 10px 0;
		overflow: hidden;
		padding: 0 10px;
		box-sizing: border-box;

	}

	.selectItem:active {
		background-color: #1296db;
		color: white;
	}

	.closeBtn {
		position: absolute;
		right: 8px;
		top: 0px;
		font-size: 18px;
	}
</style>